﻿<template v-if="PopupQuickViewVueModal.ProductType !== 10">
    <div class="prices d-flex justify-content-center align-items-start flex-column" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
        <template v-if="PopupQuickViewVueModal.ProductPrice.EnteredPrice">
            @*Display empty space*@
        </template>
        <template v-else-if="PopupQuickViewVueModal.ProductPrice.CallForPrice">
            <div class="product-price call-for-price col-12 px-0">
                <span>@Loc["Products.CallForPrice"]</span>
            </div>
        </template>
        <template v-else>
            <template v-if="PopupQuickViewVueModal.ProductPrice.IsReservation">
                <div class="rental-price mb-2">
                    <label class="mb-0">@Loc["Products.Price.ReservationPrice"]:</label>
                    <span>{{PopupQuickViewVueModal.ProductPrice.ReservationPrice}}</span>
                </div>
            </template>
            <template v-if="PopupQuickViewVueModal.ProductPrice.IsAuction">
                <template v-if="PopupQuickViewVueModal.ProductPrice.HighestBidValue > 0">
                    <div class="actual-price">
                        <label class="mb-0 bid">@Loc["Products.Price.CurrentPrice"]:</label>
                        <span>{{PopupQuickViewVueModal.ProductPrice.HighestBid}}</span>
                    </div>
                </template>
                <template v-else>
                    <div class="actual-price">
                        <label class="mb-0">@Loc["Products.Price.StartPrice"]:</label>
                        <span>{{PopupQuickViewVueModal.ProductPrice.StartPrice}}</span>
                    </div>
                </template>
            </template>
            <template v-if="PopupQuickViewVueModal.ProductPrice.CatalogPrice !== null">
                <div class="catalog-product-price col-12 px-0 mb-2">
                    <label class="col-form-label mb-0">@Loc["Products.Price.CatalogPrice"]:</label>
                    <span class="h6 mb-0">{{PopupQuickViewVueModal.ProductPrice.CatalogPrice}}</span>
                </div>
            </template>
            <template v-if="!(PopupQuickViewVueModal.ProductPrice.DisableBuyButton)">
                <div v-bind:class="{ 'product-price col-12 px-0 d-inline-flex align-items-center': (PopupQuickViewVueModal.ProductPrice.PriceWithDiscount !== null), 'non-discounted-price col-12 px-0 d-flex align-items-center': (PopupQuickViewVueModal.ProductPrice.PriceWithDiscount == null) }">
                    <span :class="['price-value-' + PopupQuickViewVueModal.ProductPrice.ProductId, {'actual-price': (PopupQuickViewVueModal.ProductPrice.PriceWithDiscount == null) }]">
                        <strong>{{PopupQuickViewVueModal.ProductPrice.Price}}</strong>
                        <template v-if="PopupQuickViewVueModal.ProductPrice.PriceWithDiscount != null">
                            <div class="d-inline-flex align-items-center product-price discounted-price col-12 px-0">
                                <label class="mb-0 mx-2">@Loc["Products.Price.WithDiscount"]:</label>
                                <span :class="'your-price price-value-' + PopupQuickViewVueModal.ProductPrice.ProductId">
                                    <strong class="actual-price" v-html="PopupQuickViewVueModal.ProductPrice.PriceWithDiscount"></strong>
                                </span>
                            </div>
                        </template>
                    </span>
                    <template v-if="PopupQuickViewVueModal.ProductPrice.OldPrice !== null">
                        <div class="old-product-price">
                            <span class="old-price mx-2">{{PopupQuickViewVueModal.ProductPrice.OldPrice}}</span>
                        </div>
                    </template>
                </div>
            </template>
            <template v-else>
                <template v-if="PopupQuickViewVueModal.ProductPrice.OldPrice !== null">
                    <div class="old-product-price">
                        <span class="old-price mx-2">{{PopupQuickViewVueModal.ProductPrice.OldPrice}}</span>
                    </div>
                </template>
            </template>
            <template v-if="PopupQuickViewVueModal.ProductPrice.BasePricePAngV !== null">
                <div class="base-price-pangv ml-2">
                    {{PopupQuickViewVueModal.ProductPrice.BasePricePAngV}}
                </div>
            </template>
            <template v-if="PopupQuickViewVueModal.ProductPrice.CurrencyCode !== null">
                <meta itemprop="priceCurrency" :content="PopupQuickViewVueModal.ProductPrice.CurrencyCode"/>
            </template>
            <template v-if="PopupQuickViewVueModal.ProductPrice.PriceWithDiscount">
                <meta itemprop="price" :content="PopupQuickViewVueModal.ProductPrice.PriceValue"/>
            </template>
        </template>
    </div>
</template>